<template>
	<!-- login view html start -->
	<view>
		<view>
			<view class="header">
				<view class="line-h"></view>
			</view>
			<view class="content">
				<view>申请获取以下权限</view>
				<text>{{userInfo.userName}}</text>
			</view>
			<button v-if="userInfo == null" class="bottom" type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机号码授权</button>
			<!-- <u-button type="success" size="mini" style="margin-top: 15rpx;" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" >获取手机号</u-button> -->

			<!-- <button size="mini" type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机号码授权</button> -->
			<button @click="getUserProfile">getUserProfile</button>
            <view v-if="wxAdmin" class="uni-list">
				<view class="uni-list-cell uni-list-cell-pd">
					<view class="uni-list-cell-db">启用管理员</view>
					<switch  @change="adminChange" />
				</view>
			</view>
		</view>
	</view>
	<!-- login view html end -->
</template>
 
<script>
	import {userLogin} from '@/js/api/loginApi'
	import {setToken} from '@/js/tokenManage'
	import {mapGetters} from 'vuex'
	export default {
		data() {
			return {
				user_img:'',
				user_name:'',
				wxCode:''
			};
		},
		
		watch:{
			userInfo:function (newVal, oldVal) {
				console.log('userInfo',newVal)
				console.log('userInfo',this.userInfo)
			}
		},
		mounted() {
			console.log('userInfo',this.userInfo)
		},
		computed:{
			...mapGetters({userInfo:'login/userInfo',wxAdmin:'login/wxAdmin'})
		},
		methods: {
			getUserProfile() {
				uni.getUserProfile({
					desc: '登录',
					success: (info) => {
						console.log(info)
                        //这里取到的是用户的信息，自己安排自己的业务
						uni.login({
							provider: 'weixin',
							success: (res) => {
								console.log(res)
                                //这里获取的是用户的code，用来换取 openid、unionid、session_key 等信息，再将信息丢给后台自己的登录业务就行了
							}
						})
					},
					fail: (err) => {
						console.log(err);
					}
				})
			},
			getCode() {
				uni.login({
						provider: 'weixin',
						success: loginRes => {
							this.wxCode = loginRes.code
						}
				});
			},
			async getPhoneNumber (e) {
				this.getCode()
				if(!this.wxCode){
					uni.showToast({
						title: '获取微信Code失败',
						duration: 1000,
						icon: "none"
					})
				}
				let ss = await  userLogin({
					encryptedData: e.detail.encryptedData,
					iv: e.detail.iv,
					code: e.detail.code
				});
				this.$store.dispatch('login/setToken',ss.data.token)
				// uni.setStorageSync('token',ss.data.token)
				// setToken()
				this.$store.dispatch('login/getUserInfo',ss.data);
			}
			,adminChange(e){
				this.$store.dispatch('login/getCheckedAdmin',e.detail.value)
			}
		},
		onLoad(options) {
			//默认加载
			// this.getUserProfile();
		}
	};
</script>
 
<style>
	.header {
		margin: 90rpx 0 90rpx 50rpx;
		border-bottom: 1px solid #ccc;
		text-align: center;
		width: 650rpx;
		height: 300rpx;
		line-height: 450rpx;
	}
 
	.header image {
		width: 200rpx;
		height: 200rpx;
	}
 
	.content {
		margin-left: 50rpx;
		margin-bottom: 90rpx;
	}
 
	.content text {
		display: block;
		color: #9d9d9d;
		margin-top: 40rpx;
	}
 
	.bottom {
		border-radius: 80rpx;
		margin: 70rpx 50rpx;
		font-size: 35rpx;
	}
</style>